<template>
    <div style="display:inline-block;padding:0 6px;" v-if="undefined != userName && userName != ''">
        <Dropdown transfer trigger="click" @on-click="handleClickUserDropdown">
            <a href="javascript:void(0)">
                <span class="main-user-name">{{ userName }}</span>
                <Icon type="arrow-down-b"></Icon>
            </a>
            <DropdownMenu slot="list">
                <DropdownItem name="ownSpace">个人中心</DropdownItem>
                <DropdownItem name="loginout" divided>退出登录</DropdownItem>
            </DropdownMenu>
        </Dropdown>
    </div>
    <div style="display:inline-block;padding:0 6px;" v-else>        
        <a href="javascript:void(0)" @click="handleClickRegister">
            <span class="main-register">注册</span>
        </a>&nbsp;&nbsp;
        <a href="javascript:void(0)" @click="handleClickLogin">
            <span class="main-login">登录</span>
        </a>
    </div>
</template>

<script>    
    import Cookies from 'js-cookie';
    import util from '@/libs/util.js';
    
    export default {
        components: {
            
        },
        data () {
            return {                
                userName: ''                
            };
        },
        computed: {
           
        },
        methods: {
            init () {
                this.userName = Cookies.get('user');                
            },            
            handleClickUserDropdown (name) {
                if (name === 'ownSpace') {
                    util.openNewPage(this, 'ownspace_index');
                    this.$router.push({
                        name: 'ownspace_index'
                    });
                } else if (name === 'loginout') {
                    // 退出登录
                    this.$store.commit('logout', this);
                    this.$store.commit('clearOpenedSubmenu');
                    this.$router.push({
                        name: 'login'
                    });
                }
            },
            handleClickLogin (){
                // 跳转登录
                this.$router.push({
                    name: 'login'
                });
            },
            handleClickRegister (){
                // 跳转注册
                this.$router.push({
                    name: 'register'
                });
            }
        },
        watch: {
            
        },
        mounted () {
            this.init();
        },
        created () {
            
        }
    };
</script>